  <!-- 分页 -->
<template>
  <div class="block">
    <el-pagination
      @current-change="handleCurrentChange"
      @size-change="setCurrentAction"
      :page-sizes="[12, 24, 36, 48]"
      :current-page="pageNum"
      :page-size="12"
      layout="total, sizes, prev, pager, next, jumper"
      :total="total"
    ></el-pagination>
  </div>
</template>

<script>
export default {
  name: "v-paging",
  props: {
    pageNum: {
      //总条数
      type: Number,
      default: 1,
    },
    total: {
      //总条数
      type: Number,
      default: 12,
    },
  },
  mounted() {
    let rangeInput = document.getElementsByClassName("el-input__inner");
    for (let i = 0; i < rangeInput.length; i++) {
      rangeInput[i].style.backgroundColor = "#fff0";
      rangeInput[i].style.color = "#fff";
    }
  },
  methods: {
    //当前页
    setCurrentAction(e) {
      this.$emit("setCurrent", e);
    },
    //条数
    handleCurrentChange(e) {
      this.$emit("setCurren", e);
    },
  },
};
</script>

<style scoped lang="scss">
.block {
  margin: 20px 0;
  display: flex;
  justify-content: flex-end;
  padding-bottom: 20px;
}
</style>
<style lang="scss">
</style>